With an increase in online transactions, App and Web users are more prone to cyber-attacks. Several big companies are investing in building a secure data transmitting system. Studies showed that Companies with weak data storage protocols are at high risk of losing a large portion of your audience. This is where Braintree comes in limelight. Braintree coupled with Paypal is one such secure gateway provider that offers fraud control tools, processes debit/ credit cards, and is available in multiple languages. Plus, Braintree supports Flutter which makes it even easier for developers to build an exquisite app for both iOS and Android with a single code base.
A mobile application build with Flutter looks native on both Android and iOS, saves App development time and money.
Follow the below-given steps to enable payment gateway support.
Steps to Enable Braintree for Flutter-build App
Step 1: Signup for a free Sandbox account to test the Braintree code.
You'll need your:
- Sandbox merchant ID
- Public key
- Private key
to test the values of a secure protocol. We will come to that later.
Step 2: Create your Flutter Project and do the followings for:
Android
Add support for Paypal Payment by adding below lines inside the AndroidManifest.xml file.
<activity android:name="com.braintreepayments.api.BraintreeBrowserSwitchActivity"
android:launchMode="singleTask">
<intent-filter>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="${applicationId}.braintree" />
</intent-filter>
</activity>
IOS:
To add support for Paypal Payment on IOS.
Basic insturctions from braintree:
1. Register URL Type
2. Update application delegate to setReturnUrlScheme
3. Update application delegate to pass the payment authorization URL to Braintree for finalization
For Detailed instuction follow steps here :- https://developers.braintreepayments.com/guides/paypal/client-side/ios/v4
Google Pay
To add support for Google Pay add below lines inside AndroidManifest.xml.
<meta-data android:name="com.google.android.gms.wallet.api.enabled" android:value="true"/>
Step3: Open Pubspec.yaml file and add the dependencies.
Step 4: Import the plugin:
import 'package:braintree_payment/braintree_payment.dart';
Step 5: Create an object of Braintree Payment and pass the client nonce.
String clientNonce = " GET YOUR CLIENT NONCE FROM YOUR SERVER";
BraintreePayment braintreePayment = new BraintreePayment();
var data = await braintreePayment.showDropIn(
nonce: clientNonce, amount: "2.0", enableGooglePay: true);
Step6: Variable data will have the payment nonce. Send the payment nonce to the server for further processing of the payment:
var data = await braintreePayment.showDropIn(
nonce: clientNonce, amount: "2.0", enableGooglePay: true);
print("Response of the payment $data");
// In case of success
//{"status":"success","message":"Payment successful. Send the payment nonce to the server for the further processing.":"paymentNonce":"jdsfhedbyq772_34dfsf"}
// In case of Failure
//{"status":"fail","message":"User canceled the payment"}
Step 7: Test the values on Sandbox and you are ready to launch the secure payments app.
Check the GitHub project to run the examples.
Disclosure: Braintree Flutter integration is an open-source code available at Github developed by Deligence Technologies. Developers can use it by following the license.
Leave Comment